<div class="header clearfix limit-width">
    <div class="headerlogo fl">
        <div class="logoimg dib">
            <img src="../../assets/img/logo.png">
        </div>
        <div class="logotext dib">2025HR</div>
    </div>

    <div class="headermenu fl tc">
        <ul class="menulist dib">
            <li class="menuitem tran3 dib"><a class="dib active" href="./"><span class="ion-ios-home-outline tran3"></span>首页</a></li>
            <li class="menuitem tran3 dib"><a class="dib" href="./course.php"><span class="ion-ios-book-outline tran3"></span>课程</a></li>
            <li class="menuitem tran3 dib"><a class="dib" href="./trainroom.php"><span class="ion-compose tran3"></span>实训室</a></li>
            <li class="menuitem tran3 dib"><a class="dib" href="./profile.php?left=fav&right=course"><span class="ion-ios-person-outline tran3"></span>我的</a></li>
        </ul>
    </div>

    <div class="headerbtn fr tr">
        <ul class="btnlist dib">
            <li class="btnitem tran3 dib dn"><a href="javascript:void(0)" class="dib" href=""><span class="ion-search tran3"></span>搜索</a></li>
            <li class="btnitem tran3 dib dn btnitemline"></li>
            <li class="btnitem tran3 dib pr"> 
                <a href="javascript:void(0)" class="dib" href=""><span class="ion-ios-email-outline tran3"></span>通知</a>
                <div class="noticelist_simple tran3">
                    <?php include './inc/noticelist_simple.html'; ?>
                </div>
            </li>
            <li class="btnitem tran3 dib btnitemline"></li>
            <li class="btnitem tran3 dib"><a  class="dib" href="./login.php"><span class="ion-log-in tran3"></span>登录</a></li>
            <li class="btnitem tran3 dib dn"><a class="dib" href="./login.php"><span class="ion-log-out tran3"></span>退出</a></li>
        </ul>
    </div>
</div>

<script>
window.onload=function(){

    $('.btnitem.pr').hover(function(){
        // $('.btnitem.pr .noticelist_simple').css({
        //     'top':'61px',
        //     'opacity':1
        // });
        $('.btnitem.pr .noticelist_simple').fadeIn(200);
    },function(){
        // $('.btnitem.pr .noticelist_simple').css({
        //     'opacity':0,
        //     'top':'-100%'
        // });
         $('.btnitem.pr .noticelist_simple').fadeOut(200);
    });

    $('.btnitem.pr').on('click',function(){
        var target = $('.btnitem.pr .noticelist_simple')[0];

        if(target.style.display=='none'){
            target.style.display='block';
        }else{
            target.style.display='none';
        }

    })
}
</script>